<template>
  <BasicForm @register="registerForm" class="mr-3 w-2/3" />
</template>
<script lang="ts" setup>
  import { BasicForm, useForm } from '@/components/Form';
  import { ref } from 'vue';
  import { FormSchema } from '@/components/Table';
  import { javaServiceModuleList } from '@/api/toolkit/project';

  // 表单数据
  const formModel = ref<any>({});

  // 表单字段
  const formSchema: FormSchema[] = [
    {
      label: '表名',
      field: 'labelName',
      component: 'Input',
      defaultValue:'t_tst',
      componentProps:{
        disabled:true,
      }
    },
    {
      field: 'className',
      label: '类名',
      component: 'Input',
    },
    {
      field: 'author',
      label: '作者',
      component: 'Input',
    },
    {
      field: 'comment',
      label: '注释',
      component: 'Input',
    },
    {
      field: 'moduleName',
      label: '模块',
      component: 'ApiSelect',
      componentProps: {
        api: javaServiceModuleList, // 网络请求地址
        params: {}, // 请求参数
        resultField: 'data', // 网络结果为: {code:0, message:{}, data:[{},{}] 格式，如果没有list，直接写 data 即可
        labelField: 'moduleName', // 选项展示名称: list 元素中每个对象的属性
        valueField: 'serviceName', // 选项值字段: list 元素中每个对象的属性
        immediate: true, // 立即加载 还是 等点击时加载
        showSearch: true, // 是否可筛选
        optionFilterProp: 'label', // 过滤字段
      },
    },

  ];
  // 注册表单
  const [registerForm, { validate, resetFields }] = useForm({
    labelWidth: 90,
    baseColProps: { span: 24, lg: 12 },
    showActionButtonGroup: false,
    schemas: formSchema,
    model: formModel,
  });

  defineExpose({
    validate
  });
</script>
